<template>
    <div>
        <el-select v-model="value" size="small" style="width: 100px">
            <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
            </el-option>
        </el-select>
        <span style="font-size: 14px;margin-left: 20px">共 {{ dataSource.length }} 条</span>
        <el-tooltip placement="top" v-for="(item, index) in dataSource" :key="index" style="margin-top: 15px">
            <div slot="content">{{ item.workOrderDescription }}</div>
            <div style="padding: 15px;border: 1px solid #ececec;border-radius: 5px">
                <div style="display:flex;font-size: 15px;justify-content: space-between">
                    <div>客户：{{ item.clientName }}</div>
                    <div style="font-size: 12px">处理状态：<span :style="{color: item.workOrderStatus == '1' ? '#2dfc1c' : '#fc4040','font-size': '12px'}">{{ item.workOrderStatus == '1' ? '已处理' : '未处理' }}</span></div>
                </div>
                <div style="font-size: 12px;color: #a6a6a6">
                    <span>工单创建时间：{{ $moment(item.createTime).format("YYYY-MM-DD HH:mm:ss") }}</span>
                    <el-divider direction="vertical"></el-divider>
                    <span>处理员工：{{ item.empName }}</span>
                </div>
            </div>
        </el-tooltip>
    </div>
</template>

<script>

const workOrderStatus = [
    {
        label: '未处理',
        value: '0'
    },
    {
        label: '已处理',
        value: '1'
    },
]

export default {
    name: "client_work_order",
    props: {
        clientInfo: {
            type: Object,
            default: () => {
            }
        }
    },
    data() {
        return {
            dataSource: [],
            options: [{
                value: '1',
                label: '全部'
            }, {
                value: '2',
                label: '待接单'
            }, {
                value: '3',
                label: '受理中'
            }, {
                value: '4',
                label: '已关闭'
            }, {
                value: '5',
                label: '已解决'
            }],
            value: '1'
        }
    },
    mounted() {
        this.$request("/api/workOrder/getWorkOrderByParams/1_0", {clientId: this.clientInfo.clientId}, "POST").then((data) => {
            this.dataSource = [...data.rows]
        })
    }
}
</script>

<style scoped>

</style>
